Avoid discovered SSH row rerenders#3858
Draft
cursor[bot] wants to merge 1 commit into
Draft
Conversation
Co-authored-by: Julius Marminge <juliusmarminge@users.noreply.github.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What Changed
handleConnectDiscoveredSshHostcallback inConnectionsSettings.DesktopSshHostRowitems instead of allocating a new inline function for every discovered SSH host on each parent render.Why
react-doctor flagged
apps/web/src/components/settings/ConnectionsSettings.tsxforInline prop defeats memo(): the discovered SSH host rows were memoized, but unrelated parent state updates (for example typing in the manual SSH host input) still invalidated every row becauseonConnectwas recreated inline. The stable wrapper keeps row props unchanged unless the underlying connect handler changes.React Scan evidence from the attached Cursor run artifacts:
react_scan_connections_ssh_before_row_renders.mp4): typingabcdefinto an unrelated input took the DesktopSshHostRow render counter from 3 to 21 (18 extra row renders), with row highlights on each keystroke.react_scan_connections_ssh_after_row_renders.mp4): the same interaction kept the DesktopSshHostRow render counter at 0, and only the input highlighted.UI Changes
No intentional visual UI changes. Before/after React Scan screen recordings are included as run artifacts:
react_scan_connections_ssh_before_row_renders.mp4react_scan_connections_ssh_after_row_renders.mp4Checklist
Validation:
vp checkpassed (pre-existing mobile lint warnings were reported, command exited 0)vp run typecheckpassedreact-doctor --category performancererun: the selectedConnectionsSettings.tsx:2498inline-prop warning is gone; other pre-existing performance findings remainNote
Memoize
onConnectcallback inConnectionsSettingsto avoid SSH row rerendersWraps the inline
onConnecthandler passed toDesktopSshHostRowin auseCallback, preventing unnecessary rerenders of discovered SSH host rows when the parent component re-renders.Macroscope summarized 65e5983.